<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="module">
        /*    
        node：
            导入require
            导出module.exports  exports
         
        ES module模块系统
            导入 import ... from ...
            导出export default   export

        模块定义:任何基于ES语法开发的脚本都可以作为ES模块使用
            有意义的模块，es模块文件中存在导出语法功能，才被叫做有意义的模块
                1.es默认导出，export default 定义需要导出的相关变量
                    一个模块只能存在一个export default

                2.es单功能导出，export js声明代码，完成声明变量或者方法的单独导出
                模块中所有的单功能导出变量或者方法都会被构建成一个匿名对象，进行导出操作
            无意义的模块

        模块的加载：
            浏览器环境：通过设定类型<script type="module">启用浏览器模块系统
                a.es默认导入import 变量名 from '模块文件路径.文件扩展名'
                    变量名接收export default 导出的数据变量
                b.es导入 import {解构变量} from '模块文件路径.文件扩展名'

                c.es组合式导入 import 自定义变量,{解构变量}  from '模块文件路径.文件扩展名'

                d.es重命名导入 以关键字as对导入变量名进行名称重定义
                如:import {student as   自定义名称 } from "./module/module-d.js";
                以指代关键字*加as 后面跟别名，可以直接导出单功能构建的匿名对象
        */
        import showMsg from "./module/module-a.js";
        console.log(showMsg);
        showMsg();

        import {username,password,printFun,nums} from "./module/module-b.js";
        console.log(username,password,printFun,nums);

        import arrs,{student} from "./module/module-c.js";
        console.log(arrs,student);


        import {student as stu } from "./module/module-d.js";
        console.log(stu);

        import * as obj from "./module/module-b.js";
        console.log(obj.username,obj.password);
    </script>
</body>
</html>